<template>
  <div class="form-preview-group">
    <label>
      {{_displayName}} 
      <span class="form-preview-notNull" v-if="showRequired">*</span>
      <i class="iconfont icon-yidongduanxianshi" v-if="field.isAppShow === 1"></i>
    </label>
    <div class="form-preview-mock">
      <p class="form-preview-control" :class="{'form-preview-withIcon': isCode}">
        {{  autoSerialNumber ? autoPla : ''}}
        <i class="iconfont icon-scan" v-if="isCode"></i>
      </p>
    </div>
  </div>
</template>

<script>
import { previewProps } from '@src/component/form/components/props';
import translate from '@src/component/form/mixin/translate.js'
import { transformI18n } from '@src/locales'

export default {
  name: 'form-text-preview',
  props: previewProps,
  mixins:[translate],
  computed: {
    /** 是否为扫码类型 */
    isCode(){
      return this.field.formType == 'code' || !!this.field?.setting?.isScanCode;
    },
    disabled() {
      let field = this.field;
      return field.disabled
        || (field.setting && field.setting.defaultValueConfig && !!field.setting.defaultValueConfig.isNotModify && !!field.defaultValue);
    },
    showRequired() {
      let field = this.field;
      return field.isNull == 0 && !this.disabled;
    },
    /**
     * @des 编号一类的提示存在两套
     * 1. 客户编号 2.产品类型编号
     */
    autoSerialNumber(){
      return this.field?.setting?.autoSerialNumber || this.field?.setting?.autoGeneration
    },
    autoPla(){
      return `${this._displayName}${transformI18n('common.form.preview.text.des7', this.formPreviewLocale)}`
    }
  }
}
</script>